<template>
  <view class="introduce">
      <view class="i-1">
        <view class="school-name">北京市顺义区诺德安达学校</view>
        <navigator  class="view-details" url="/pages/schoolDetails2/index">
         <view>查看详情</view>
        </navigator>
      </view>
      <view class="i-2">
        <view class="article">
          <view class="s-title">所在地区:</view>
          <view class="s-text">北京市顺义区高丽营镇</view>
        </view>
      </view>
      <view class="i-3">
        <view class="c-text">上海德英乐学院是万科旗下重点打造的一所重点国际高中，以“教育成就理想人生”作为办学理念，致力于培养立身世界的中华英才。学院坐落于闵行七宝，地理位置优越，多条轨道交通直达。学校校园环境优美，配备图书馆、物理、化学及生物实验室、艺术工坊、健身房、舞蹈房、万科特色赛艇训练馆、攀岩馆、篮球场和足球场等，开放式的学习空间让学生充分感受国际化氛围，现代化的场馆设施满足学生全方位发展的需求。学校始终坚持大力整合</view>
      </view>
      <view class="i-4">
        <image class="school-image" v-for="item in listUrl" :key="item.id" :src="item.url"></image>
      </view>
    </view>
</template>

<script>
export default {
  props:['listUrl'],
  data(){
    return{

    }
  },
  methods:{

  }
}
</script>

<style>
.introduce {
  background-color: white;
  padding: 20px;
  margin-top: 20px;
  width: 100%;
}
.i-1 {
  display: flex;
  margin: 0 auto;
  align-items: center;
  height: 80px;
}
.school-name {
  width: 70%;
  color: #0B6DB6;
  font-size: 40px;
  font-weight: bold;
}
.view-details {
  width: 20%;
  height: 60%;
  text-align: center;
  margin-left: auto;
  border: 1px solid #ccc;
}
.i-2 {
  padding: 20px 0px;
  border-bottom: 1px dashed #ccc;
}
.s-title{
  font-size: 27px;
  font-weight: bold;
}
.s-text {
  font-size: 27px;
  padding-left: 30px;
}
.article {
  margin-top: 22px;
  display: flex;
}
.i-3 {
  margin: 0 auto;
  margin-top: 20px;
}
.c-text {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 50px;
}
.i-4{
    padding: 30px 0px;
    display: flex;
    justify-content:space-between;
    flex-wrap: wrap;
    
}
.school-image{
    width: 48%;
    height: 45%;
    background-color: yellow;
}
</style>